<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link type="text/css" href="css/ui-lightness/jquery-ui-1.8.20.custom.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.8.20.custom.min.js"></script>
<title>Register for new member</title>

<script type="text/javascript">
	$(document).ready(
					function() {
						var bValid = true;

						email = $("#email"), password1 = $("#password1"),
								password2 = $("#password2"),
								password = $("#password"), name = $("#name");

						function checkLength(o, n, min, max) {
							if (o.val().length > max || o.val().length < min) {
								o.addClass("ui-state-error");
								updateTips("Length of " + n
										+ " must be between " + min + " and "
										+ max + ".");
								return false;
							} else {
								return true;
							}
						}

						function checkRegexp(o, regexp, n) {
							if (!(regexp.test(o.val()))) {
								o.addClass("ui-state-error");
								updateTips(n);
								return false;
							} else {
								return true;
							}
						}

						function checkPassword() {
							if (password1.val() != password2.val()) {
								alert("Passwords do not match.");
								return false;
							} else {
								password = password1;
								return true;
							}
						}

						$("#chkemail").button().click(
										function() {
											bValid = checkLength(email,
													"email", 6, 80)
													&& checkRegexp(
															email,
															/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i,
															"eg. ui@jquery.com");

											if (bValid) {
												var user_email = new Common.data.chk_email(email.val());
												var json_email = JSON.stringify(user_email);
												$.ajax({
															url : 'user?cmd=checkEmail',
															type : 'post',
															data : json_email,
															dataType : "json",
															error : function(xhr, status, e) {
																alert('Error=' + e);
															},
															success : function(jsonData) {
																if (jsonData.result == "available") {
																	alert("사용할 수 있는 email 주소입니다.");
																	document.getElementById("password1").focus();
																	document.getElementById("email").disabled = true;
																} else {
																	alert("이미 등록된 email 주소입니다. " + email.val() + "(은)는 사용할 수 없습니다. ");
																	document.getElementById("email").focus();
																}
															}
														});
											}
										});

						$("#user-create").button().click(
										function() {
											var firstName = document.getElementById("firstname").value;
											var lastName = document.getElementById("lastname").value;

											name = lastName + " " + firstName;
											bValid = bValid && checkPassword();
											bValid = bValid && checkLength(password, "password", 5, 16);
											bValid = bValid && checkRegexp(password, /^([0-9a-zA-Z])+$/, "Password field only allow : a-z 0-9");

											if (bValid) {
												var user_data = new Common.data.user(
														$("#email").val(),
														password.val(), $(
																"#nickname")
																.val(), name);
												var json_data = JSON
														.stringify(user_data);

												$.ajax({
															url : 'user?cmd=regist',
															type : 'post',
															data : json_data,
															dataType : "json",
															error : function(xhr, status, e) {
																alert('Error=' + e);
															},
															success : function(jsonData) {
																if (jsonData.result == "regist success!!") {
																	alert("성공적으로 가입되었습니다");
																	window.location.href = "/omniboard/list.jsp";
																} else {
																	alert("회원가입에 실패하였습니다");
																}
															}
														});
											}
										});

						$("#user-cancel").button().click(function() {
							window.location.href = "/omniboard/list.jsp";
						});
					});
</script>
</head>
<body>
	<div class="header">
		<h3>Create an Account</h3>
	</div>
	<div id="form" class="ui-widget ui-widget-content ui-corner-all">
		<form action="user?cmd=regist">
			<input type="hidden" name="password" id="password" /> <input
				type="hidden" name="name" id="name" />
			<table>
				<tr>
					<td colspan="3" valign="top"><span class="blue_bold_font">Required
							information for OMNIBUSCODE account</span></td>
				</tr>
				<tr>
					<td><label for="email">Your current email address:</label></td>
					<td><input id="email" type="text" name="email" size="30"
						value="fu5858@naver.com" /><br> <span class="grey_font">
							e.g. myname@example.com. This will be used to sign-in to your
							account. </span></td>
					<td><input type="button" id="chkemail" name="chkemail"
						value="Check to duplicate an email" /></td>
				</tr>
				<tr>
					<td><label for="password1">Choose a password:</label></td>
					<td colspan="2"><input id="password1" type="password"
						name="password1" size="30" value="ahrrhd" /><br> <span
						class="grey_font"> Passwords must be 6 or more characters
							and contain a number. </span></td>
				</tr>
				<tr>
					<td><label for="password2">Re-enter password:</label></td>
					<td colspan="2"><input id="password2" type="password"
						name="password2" size="30" value="ahrrhd" /></td>
				</tr>
				<tr>
					<td colspan="3"><hr></td>
				</tr>
				<tr>
					<td colspan="3" valign="top"><span class="blue_bold_font">Additional
							information for OMNIBUSCODE account</span></td>
				</tr>
				<tr>
					<td><label for="nickname">Nick Name:</label></td>
					<td colspan="2"><input id="nickname" type="text"
						name="nickname" size="30" value="blue sky" /></td>
				</tr>
				<tr>
					<td><label for="firstname">First Name:</label></td>
					<td colspan="2"><input id="firstname" type="text"
						name="firstname" size="30" value="Kiwon" /></td>
				</tr>
				<tr>
					<td><label for="lastname">Last Name:</label></td>
					<td colspan="2"><input id="lastname" type="text"
						name="lastname" size="30" value="Lee" /></td>
				</tr>
				<tr>
					<td colspan="3">
						<a href="#" target="_self" id="user-create" name="user-create">등록</a>
						<a href="#" target="_self" id="user-cancel" name="user-cancel">취소</a></td>
				</tr>
			</table>

		</form>
	</div>
</body>
</html>